@big-bg: #344c8c; //大标题背景
@big-bd: linear-gradient(to right, #9fb3cf, transparent) 40 40 stretch; //大标题边框
@small-bg: linear-gradient(to right, #68519f, #83c1e1); //小标题渐变背景
@IconBackground: linear-gradient(to top, #68519f, #85c8e5); //图标渐变背景

//大标题
.title {
  width: 100%;
  background: @big-bg;
  border-top: 3px solid #ddd;
  border-bottom: 3px solid #ddd;
  border-image: @big-bd;
  -webkit-border-image: @big-bd;
  -moz-border-image: @big-bd;

  h3 {
    width: 100%;
    font-size: 20px;
    padding: 5px 0;
    font-weight: 600;
    margin-left: 16px;
    color: #fff;

    span {
      font-size: 16px;
      margin-left: 16px;
      font-weight: 500;
    }
  }
}

//小标题
.small-title {
  width: 60%;
  display: flex;
  align-items: center;
  border: 1px solid #fff;
  background-image: @small-bg;

  h3 {
    color: #fff;
    font-size: 16px;
    padding: 2px 0;
    margin-left: 15px;
  }
}

//副小标题
.sub-title {
  width: 50%;
  color: #fff;
  font-size: 16px;
  padding: 5px 0;
  padding-left: 15px;
  border-radius: 3px;
  background: rgba(154, 153, 180, 0.6);
}